<template>
	<div id='system' v-loading="loading">
		<div class="content-top">
			<span class="h1">还款明细</span>
			<!--<span class="h2">商家查询</span>-->
		</div>
		<div class="top-btn clearfix">
			<div class="left-content">
				<span class="tip">还款明细查询</span>
			</div>
			<div class="right-search1">
				<el-input v-model="input" placeholder="输入关键词…"></el-input>
				<el-button type="primary" @click="look()" style="margin-left: 10px;">查看</el-button>
				<el-button type="primary" @click="execl()">导出excel</el-button>
			</div>
		</div>
		<el-table :data="tableData" style="width: 100%">
			<el-table-column label="姓名">
				<template slot-scope="scope">
					<span>{{ scope.row.MemberInfo.CNName }}</span>
				</template>
			</el-table-column>
			<el-table-column label="收款负责人">
				<template slot-scope="scope">
					<span>{{ scope.row.LoanInof.ReceiveMan }}</span>
				</template>
			</el-table-column>
			<el-table-column label="手机号">
				<template slot-scope="scope">
					<span>{{ scope.row.MemberInfo.Tel }}</span>
				</template>
			</el-table-column>
			<!--<el-table-column label="QQ">
				<template slot-scope="scope">
					<span>{{ scope.row.MemberInfo.QQ }}</span>
				</template>
			</el-table-column>-->
			<el-table-column label="微信">
				<template slot-scope="scope">
					<span>{{ scope.row.MemberInfo.WX }}</span>
				</template>
			</el-table-column>
			<el-table-column label="放款编号">
				<template slot-scope="scope">
					<span>{{ scope.row.LoanInof.BillCode }}</span>
				</template>
			</el-table-column>
			<el-table-column prop="RefundDate" label="还款日期">
			</el-table-column>
			<el-table-column prop="Interest" label="利息">
			</el-table-column>
			<el-table-column prop="RefundMoney" label="还款金额">
			</el-table-column>
			<el-table-column prop="OutDays" label="超期天数">
			</el-table-column>
			<el-table-column label="备注">
				<template slot-scope="scope">
					<span class="spanConten" @click="beizhu(scope.row.Memo)">{{ scope.row.Memo }}</span>
				</template>
			</el-table-column>
			<el-table-column label="放款渠道">
				<template slot-scope="scope">
					<span>{{ scope.row.LoanInof.AccountType }}</span>
				</template>
			</el-table-column>
			<el-table-column label="操作">
				<template slot-scope="scope">
					<el-button size="mini" type="danger" @click="del(scope.row.LoanID)">删除</el-button>
				</template>
			</el-table-column>
		</el-table>
		<div class="pages">
			<el-pagination small :current-page="index" @current-change="handleCurrentChange" layout="prev, pager, next" :total="total" background prev-text='上一页' next-text='下一页'>
			</el-pagination>
		</div>
		<el-dialog title="备注" :visible.sync="beiz" width="30%" :before-close="handleClose">
			<p>{{conten}}</p>
			<span slot="footer" class="dialog-footer">
				<el-button type="primary" @click="guanb()">关 闭</el-button>
			</span>
		</el-dialog>
	</div>
</template>

<script>
	import apis from '../../../api/prouserApi'
	export default {
		name: 'repayment',
		data() {
			return {
				conten:'',
				beiz:false,
				loading:true,
				index:1,//页码
				total:1,//总条数
				input: '', //搜索
				tableData: [],//还款列表
				ProviderID:'',
			}
		},
		created() {
			this.ProviderID = sessionStorage.ProviderID
			this.getrefundlist(this.index)
		},
		methods: {
			execl(){
				this.loading = true
				this.$axios.post(apis.getrefundlist,{
				  "Para": this.input,
				  "PageSize":10,
				  "PageIndex": this.index-1,
				  "OrderbyString": "PName",
				  "ToExcel": true,
				}).then(res=>{
					if(res.data.isOK){
						if(res.data.data.ExcelResult && res.data.data.ExcelResult.isOK) {
							this.loading = false
							var urls = res.data.data.ExcelResult.data.filePath
							window.location.href = apis.host+'/template/'+urls
						} else{
							this.loading = false
							this.$message.error(res.data.data.ExcelResult.msg);
						}
					} else {
						if(res.data.msg == "Token无效" || res.data.msg == "Token缺失") {
							this.$router.push({
								path: '/'
							})
						} else {
							this.loading = false
							this.$message.error(res.data.msg);
						}
					}
				})
			},
			handleEdit(index, row) {
				console.log(index, row);
			},
			handleDelete(index, row) {
				console.log(index, row);
			},
			handleClose() {
				this.beiz = false
			},
			//分页
			handleCurrentChange(val){
				this.index =  val
				this.getrefundlist(this.index)
			},
			//获取还款列表
			getrefundlist(val) {
				this.loading = true
				this.$axios.post(apis.getrefundlist,{
				  "Para": this.input,
				  "PageSize":10,
				  "PageIndex": val-1,
				  "OrderbyString": "PName",
				  "ToExcel": false,
				}).then(res=>{
					if(res.data.isOK) {
						this.loading = false
						this.tableData = res.data.data.Data
						this.total = res.data.data.Items?res.data.data.Items:1
					} else {
						if(res.data.msg == "Token无效" || res.data.msg == "Token缺失") {
							this.$router.push({
								path: '/'
							})
						} else {
							this.loading = false
							this.$message.error(res.data.msg);
						}
					}
				})
			},
			//chakan
			look(){
				this.index = 1
				this.getrefundlist(this.index)
			},
			//删除
			del(id){
				this.loading = true
				this.$axios.get(apis.delrefund+'/'+id).then(res=>{
					if(res.data.isOK) {
						this.getrefundlist(this.index) 
					} else {
						if(res.data.msg == "Token无效" || res.data.msg == "Token缺失") {
							this.$router.push({
								path: '/'
							})
						} else {
							this.loading = false
							this.$message.error(res.data.msg);
						}
					}
				})
			},
			beizhu(e){
				this.beiz = true
				this.conten = e
			},
			guanb(){
				this.beiz = false
			}
		}
	}
</script>

<style>
	
</style>